<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        body,
        html,
        #allmap {
            width: 100%;
            height: 100%;
            overflow: hidden;
            margin: 0;
            font-family: "微软雅黑";
        }

        .BMap_cpyCtrl,
        .anchorBL {
            display: none;
        }
    </style>
    <script src="https://api.map.baidu.com/api?type=webgl&v=1.0&ak=alRLqUEfYGUM3af8pN2PpsXkbRjCtB0W"></script>
    <script src="https://mapv.baidu.com/build/mapv.min.js"></script>
    <script src="https://code.bdstatic.com/npm/mapvgl@1.0.0-beta.60/dist/mapvgl.min.js"></script>
    <script src="https://code.bdstatic.com/npm/mapvgl@1.0.0-beta.60/dist/mapvgl.threelayers.min.js"></script>
    <title>地球模式</title>
</head>

<body>
    <div id="allmap"></div>
</body>

</html>
<script type="text/javascript">
    // -----------外地球初始
    function intOutmap(point, zoom) {
        // GL版命名空间为BMapGL
        let map = new BMapGL.Map("allmap");    // 创建Map实例
        map.centerAndZoom(new BMapGL.Point(232, 30), 4);  // 初始化地图,设置中心点坐标和地图级别
        // 104.081988, 30.705364
        // map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
        map.setMapType(BMAP_EARTH_MAP);      // 设置地图类型为地球模式   
        const center = map.getViewport().center //当前中心点
        //  添加外地球动画
        console.log(666, map)
        outRun(map)
        // 拖拽
        // map.addEventListener('dragging', (e) => {
        //     console.log(e)
        // })
    }
    // -------外地球动画
    function outRun(map) {
        let timer = null;
        timer = setInterval(() => {
            map.panBy(50, 0) //持续偏移
            const center = map.getViewport().center //当前中心点
            // 用经纬度判断当前位置=》增加连贯性
            console.log(666, center.lat)
            if (center.lat > 33.7) {
                clearInterval(timer)
                map.setZoom(5)
                map.panBy(0, 15)
                map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
                // intInMap(map)
                test1(map)
            }
        }, 100);
    }
    // // ----初始化内地图自带的动画
    // function intInMap(map) {
    //     map.setMapType(BMAP_NORMAL_MAP)
    //     map.centerAndZoom(new BMapGL.Point(104.081988, 30.705364), 12);
    //     // map.setTilt(45)
    //     // map.setHeading(-45.3);
    //     map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
    // }
    intOutmap()
    // // 监听鼠标缩放
    // document.addEventListener('mousewheel', (e) => {
    //     e = e || window.event;
    //     var t1 = map.getZoom();
    //     console.log(111, t1)
    // }, false);
</script>